Android 几种弹框样式 自定义Dialog PopupWindow的使用 |
您所在的位置：网站首页 › android 弹窗 › Android 几种弹框样式 自定义Dialog PopupWindow的使用 |
Android 几种弹框样式 自定义Dialog PopupWindow的使用
|
1.弹框的波浪线是动态的 和小度弹框样式相似 用到PopWindow 和自定义View . 2.这个弹框是动态的 用于网络加载时候 用到自定义Dialog
3.这就是一简单通用的弹框样式
第一种弹框实现方式： private void showPopupWindow() { View contentView = LayoutInflater.from(MainActivity.this).inflate(R.layout.popuplayout, null); mPopWindow = new PopupWindow(contentView, ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT, true); mPopWindow.setFocusable(true); mPopWindow.setOutsideTouchable(true); mPopWindow.setContentView(contentView); TextView tv_more_skill = contentView.findViewById(R.id.tv_more_skill); View rootview = LayoutInflater.from(MainActivity.this).inflate(R.layout.activity_main, null); mPopWindow.showAtLocation(rootview, Gravity.BOTTOM, 0, 0);} xml布局 popuplayout 自定义View VolumeWaveView import android.animation.ValueAnimator; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.LinearGradient; import android.graphics.Paint; import android.graphics.Path; import android.graphics.Shader; import android.support.annotation.Nullable; import android.util.AttributeSet; import android.view.View; import android.view.animation.DecelerateInterpolator; import java.util.Random; public class VolumeWaveView extends View { private static final String TAG = "VolumeWaveView"; private static final int HEIGHT = 360;//整个控件的高度 private static final int HEIGHT1 = 60;//第一层曲线的高度 private static final int HEIGHT2 = 40;//第二层曲线的高度 private static final int HEIGHT3 = 50;//第三层曲线的高度 private int h1 = 0,h2 = 0, h3 = 0,h4 = 0,h5 = 0; private int range = 0;//波动的幅度,你可以动态改变这个值，比如麦克风录入的音量的高低 private Path path; private Paint paint1,paint2,paint3,paint4; private LinearGradient linearGradient1,linearGradient2,linearGradient3,linearGradient4;//四种渐变色 private ValueAnimator animator1,animator2,animator3,animator4,animator5;//五种动画 public VolumeWaveView(Context context) { this(context,null); } public VolumeWaveView(Context context, @Nullable AttributeSet attrs) { this(context,attrs,0); } public VolumeWaveView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs,defStyleAttr); initPaint(); startAnimation(); } /** * 初始化画笔 */ private void initPaint(){ path = new Path(); paint1 = new Paint(); paint1.setStyle(Paint.Style.FILL); paint1.setAntiAlias(true);//抗锯齿 //渐变色1 linearGradient1 = new LinearGradient(0, 0, 0, HEIGHT1, Color.parseColor("#e652a6d2"), Color.parseColor("#e652d5a1"), Shader.TileMode.MIRROR); paint1.setShader(linearGradient1); paint2 = new Paint(); paint2.setAntiAlias(true);//抗锯齿 paint2.setStyle(Paint.Style.FILL); //渐变色2 linearGradient2 = new LinearGradient(0, 0, 0, HEIGHT2, Color.parseColor("#e68952d5"), Color.parseColor("#e6525dd5"), Shader.TileMode.MIRROR); paint2.setShader(linearGradient2); paint3 = new Paint(); paint3.setAntiAlias(true);//抗锯齿 paint3.setStyle(Paint.Style.FILL); //渐变色3 linearGradient3 = new LinearGradient(0, 0, 0, HEIGHT3, Color.parseColor("#e66852d5"), Color.parseColor("#e651b9d2"), Shader.TileMode.MIRROR); paint3.setShader(linearGradient3); paint4 = new Paint(); paint4.setAntiAlias(true);//抗锯齿 paint4.setStyle(Paint.Style.FILL); //渐变色4 linearGradient4 = new LinearGradient(0, 0, 0, HEIGHT2, Color.parseColor("#e6d5527e"), Color.parseColor("#e6bf52d5"), Shader.TileMode.MIRROR); paint4.setShader(linearGradient4); } /** * draw方法中不要创建大量对象，尽量复用对象 * @param canvas */ @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); drawLayer3(canvas); drawLayer2(canvas); drawLayer1(canvas); } /** * 绘制第一层 * @param canvas */ private void drawLayer1(Canvas canvas){ drawCurve(path,canvas,paint1,getWidth()/5,getWidth()/3,h1); drawCurve(path,canvas,paint1,getWidth()/3+getWidth()/5,getWidth()/3,h2); } /** * 绘制第二层 * @param canvas */ private void drawLayer2(Canvas canvas){ drawCurve(path,canvas,paint2,0,getWidth()/2,h3); drawCurve(path,canvas,paint4,getWidth()/2-10,getWidth()/2,h4); } /** * 绘制第三层 * @param canvas */ private void drawLayer3(Canvas canvas){ drawCurve(path,canvas,paint3,getWidth()/4,getWidth()/2,h5); } /** * 画贝塞尔曲线 * @param path * @param canvas * @param x 横向起点的位置(用于摆放曲线的左右的位置) * @param width 曲线的整个宽度 * @param height 曲线的高度 */ private void drawCurve(Path path,Canvas canvas,Paint paint,int x,int width,int height){ path.reset(); /*因为这个弧形（类似一个山峰的形状） * 其实就是三个贝塞尔曲线组成； * 而每个贝塞尔曲线需要三个点，三个点连接起来也就是两部分构成； * 所以，这三个贝塞尔曲线就是由六部分组成了（A，B，C，D，E，F，G）， * 所以这里就平均分一下，建议用笔在纸上画一下，就晓得了**/ int subWidth = width/6;//每小部分的宽度 path.moveTo(x,HEIGHT);//起点 A path.quadTo(x+subWidth,HEIGHT-height,x+subWidth*2,HEIGHT-height*2);//B - C path.lineTo(x+subWidth*2,HEIGHT-height*2);//C path.quadTo(x+subWidth*3,HEIGHT-height*3,x+subWidth*4,HEIGHT-height*2);//D - E path.lineTo(x+subWidth*4,HEIGHT-height*2);// E path.quadTo(x+subWidth*5,HEIGHT-height,x+subWidth*6,HEIGHT);//F - G canvas.drawPath(path,paint); } /** * 添加属性动画,每一个动画的变化范围和周期都不一样，这样错开的效果才好看点 */ public void startAnimation() { Random random = new Random(); range = random.nextInt(100)%(100-10+1) + 10;//波动的幅度，模拟动态音量输入，你可以自己设置 animator1 = ValueAnimator.ofInt(0,HEIGHT1,0); animator1.setDuration(1400); animator1.setInterpolator(new DecelerateInterpolator()); //无限循环 animator1.setRepeatCount(ValueAnimator.INFINITE); animator1.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { h1 = (int) animation.getAnimatedValue(); invalidate(); } }); animator1.start(); animator2 = ValueAnimator.ofInt(0,HEIGHT1,0); animator2.setDuration(1700); animator2.setInterpolator(new DecelerateInterpolator()); //无限循环 animator2.setRepeatCount(ValueAnimator.INFINITE); animator2.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { h2 = (int) animation.getAnimatedValue(); invalidate(); } }); animator2.start(); animator3 = ValueAnimator.ofInt(0,HEIGHT2,0); animator3.setDuration(1600); animator3.setInterpolator(new DecelerateInterpolator()); //无限循环 animator3.setRepeatCount(ValueAnimator.INFINITE); animator3.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { h3 = (int) animation.getAnimatedValue(); invalidate(); } }); animator3.start(); animator4 = ValueAnimator.ofInt(0,HEIGHT2,0); animator4.setDuration(1300); animator4.setInterpolator(new DecelerateInterpolator()); //无限循环 animator4.setRepeatCount(ValueAnimator.INFINITE); animator4.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { h4 = (int) animation.getAnimatedValue(); invalidate(); } }); animator4.start(); animator5 = ValueAnimator.ofInt(0,HEIGHT3,0); animator5.setDuration(2000); animator5.setInterpolator(new DecelerateInterpolator()); //无限循环 animator5.setRepeatCount(ValueAnimator.INFINITE); animator5.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { h5 = (int) animation.getAnimatedValue(); invalidate(); } }); animator5.start(); } /** * 关闭动画 */ public void removeAnimation(){ if (animator1 != null){ animator1.cancel(); animator1 = null; } if (animator2 != null){ animator2.cancel(); animator2 = null; } if (animator3 != null){ animator3.cancel(); animator3 = null; } if (animator4 != null){ animator4.cancel(); animator4 = null; } if (animator5 != null){ animator5.cancel(); animator5 = null; } } } 第二种弹框实现方式 /** * 自定义dialog */ public class LoadingDialog extends Dialog { private Context context; private static LoadingDialog dialog; private static ImageView ivProgress; private static TextView tvText; public LoadingDialog(Context context) { super(context); this.context = context; } public LoadingDialog(Context context, int themeResId) { super(context, themeResId); this.context = context; } //显示dialog的方法 public static LoadingDialog showDialog(Context context, String msg) { dialog = new LoadingDialog(context, R.style.LoadDialog);//dialog样式 dialog.setContentView(R.layout.dialog_layout);//dialog布局文件 tvText = dialog.findViewById(R.id.tvText); if (ValidationUtils.isNotEmpty(msg)) { tvText.setText(msg); } ivProgress = dialog.findViewById(R.id.ivProgress); dialog.setCanceledOnTouchOutside(false);//点击外部不允许关闭dialog return dialog; } @Override public void onWindowFocusChanged(boolean hasFocus) { super.onWindowFocusChanged(hasFocus); if (hasFocus && dialog != null) { startAnimation(); } else { endAnimation(); } } @Override public void setOnDismissListener(@Nullable OnDismissListener listener) { super.setOnDismissListener(listener); endAnimation(); } private void startAnimation() { Animation animation = AnimationUtils.loadAnimation(context, R.anim.umcsdk_anim_loading); ivProgress.startAnimation(animation); } private void endAnimation() { Animation animation = AnimationUtils.loadAnimation(context, R.anim.umcsdk_anim_loading); animation.cancel(); } } style LoadDialog样式 @null true true true @android:color/transparent true 0.6xml 布局dialog_layout drawable 背景sy_sdk_shap_bg mipmap 图片 loading_progress
代码中使用： private LoadingDialog mLoadingDialog;//显示Dialog public void Dialog() { if (mLoadingDialog == null) { mLoadingDialog = LoadingDialog.showDialog(this, ""); } mLoadingDialog.show(); } //显示Dialog传入msg public void ssDialog(String msg) { if (mLoadingDialog == null) { mLoadingDialog = LoadingDialog.showDialog(this, msg); } mLoadingDialog.show(); } //销毁Dialog public void hDialog() { if (mLoadingDialog != null) { mLoadingDialog.dismiss(); } } 第三种弹框实现方式：
1.ShowDialog public class ShowDialog { private FamilyDialog customDialog; public ShowDialog() { } public void show(final Context context, String message, final OnBottomClickListener onBottomClickListener) { customDialog = new FamilyDialog(context); customDialog.setMessage(message); customDialog.setYesOnClickListener("确定", new FamilyDialog.onYesOnClickListener() { @Override public void onYesClick() { if (onBottomClickListener != null) { onBottomClickListener.positive(); } customDialog.dismiss(); } }); customDialog.setNoOnClickListener("取消", new FamilyDialog.onNoClickListener() { @Override public void onNoClick() { if (onBottomClickListener != null) { onBottomClickListener.negative(); } customDialog.dismiss(); } }); customDialog.show(); } public void show2(final Context context, String message,String confirm, final OnBottomClickListener onBottomClickListener) { customDialog = new FamilyDialog(context); customDialog.setMessage(message); customDialog.setYesOnClickListener(confirm, new FamilyDialog.onYesOnClickListener() { @Override public void onYesClick() { if (onBottomClickListener != null) { onBottomClickListener.positive(); } customDialog.dismiss(); } }); customDialog.setNoOnClickListener("取消", new FamilyDialog.onNoClickListener() { @Override public void onNoClick() { if (onBottomClickListener != null) { onBottomClickListener.negative(); } customDialog.dismiss(); } }); customDialog.show(); } public interface OnBottomClickListener { void positive(); void negative(); } }2.FamilyDialog private Button yes; //确定按钮 private Button no; //取消按钮 // private TextView title; //消息标题文本 private TextView message; //消息提示文本 private String titleStr; //从外界设置的title文本 private String messageStr; //从外界设置的消息文本 private String yesStr, noStr; //确定文本和取消文本的显示内容 private Window window = null; private onYesOnClickListener yesOnClickListener; //确定按钮被点击了的监听器 private onNoClickListener noOnClickListener; //取消按钮被点击了的监听器 public FamilyDialog(@NonNull Context context) { super(context, R.style.CustomDialog); } @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.layout_dialog_family); //点击dialog以外的空白处是否隐藏 setCanceledOnTouchOutside(false); //初始化界面控件 initView(); //初始化界面数据 initData(); //初始化界面控件的事件 initEvent(); //设置窗口显示 windowDeploy(); } /** * 初始化界面控件 */ private void initView() { yes = (Button) findViewById(R.id.yes); no = (Button) findViewById(R.id.no); // title = (TextView) findViewById(R.id.title); message = (TextView) findViewById(R.id.message); } /** * 初始化界面控件的显示数据 */ private void initData() { // if (TextUtils.isEmpty(titleStr)) { // title.setText(titleStr); // } else { // title.setText("应用提示"); // } if (messageStr != null) { message.setText(messageStr); } if (yesStr != null) { yes.setText(yesStr); } if (noStr != null) { no.setText(noStr); } } /** * 初始化界面的确定和取消监听器 */ private void initEvent() { //设置确定按钮被点击后，向外界提供监听 yes.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { if (yesOnClickListener != null) { yesOnClickListener.onYesClick(); } } }); //设置取消按钮被点击后，向外界提供监听 no.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { if (noOnClickListener != null) { noOnClickListener.onNoClick(); } } }); } private void windowDeploy() { window = getWindow(); window.setGravity(Gravity.CENTER); //设置窗口显示位置 // window.setWindowAnimations(R.style.dialogWindowAnim); //设置窗口弹出动画 } /** * 设置确定按钮的显示内容和监听 * * @param str * @param onYesOnClickListener */ public void setYesOnClickListener(String str, onYesOnClickListener onYesOnClickListener) { if (str != null) { yesStr = str; } this.yesOnClickListener = onYesOnClickListener; } /** * 设置取消按钮的显示内容和监听 * * @param str * @param onNoClickListener */ public void setNoOnClickListener(String str, onNoClickListener onNoClickListener) { if (str != null) { noStr = str; } this.noOnClickListener = onNoClickListener; } /** * 从外界Activity为Dialog设置标题 * * @param title */ public void setTitle(String title) { titleStr = title; } /** * 从外界Activity为Dialog设置dialog的message * * @param message */ public void setMessage(String message) { messageStr = message; } /** * 设置确定按钮和取消被点击的接口 */ public interface onYesOnClickListener { void onYesClick(); } public interface onNoClickListener { void onNoClick(); } }3.xml 布局 layout_dialog_family 4. bg_dialog_white_color 5. bg_dialog_btn_left 6. bg_dialog_btn_right 7.style 样式 CustomDialog @android:color/transparent true @null true true8.代码中使用 new ShowDialog().show(context, "想要写的提示语", new ShowDialog.OnBottomClickListener() { @Override public void positive() { //确定操作 } @Override public void negative() { //取消操作 } });
|
【本文地址】
公司简介
联系我们
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |